<template>
	<view class="content">
		<view class="addressBox">
			<view class="left">
				<view class="ji">寄</view>
				<view class="line"></view>
				<view class="shou">收</view>
			</view>
			<view class="right">
				<view class="top" @click="goInfo('/pages-send/myAddress/myAddress?type=0')" v-if="!jjAdd">
					<view class="top-left">
						<view class="title">寄件人信息</view>
						<view class="text">请输入寄件人信息</view>
					</view>
					<view class="top-right">
						|  <view class="pu">地址簿</view>
					</view>
				</view>
				<view class="address" v-if="jjAdd">
					<view class="add-top">
						<text>{{jjAdd.name}}</text>
						<text style="margin-left: 40rpx;">{{jjAdd.phone}}</text>
					</view>
					<view class="add-bottom">
						{{jjAdd.province}}-{{jjAdd.city}}-{{jjAdd.district}}-{{jjAdd.detail}}
					</view>
				</view>
				<view class="lines"></view>
				<view class="top" @click="goInfo('/pages-send/myAddress/myAddress?type=1')" v-if="!sjAdd">
					<view class="top-left">
						<view class="title">收件人信息</view>
						<view class="text">请输入收件人信息</view>
					</view>
					<view class="top-right">
						|  <view class="pu">地址簿</view>
					</view>
				</view>
				<view class="address" v-if="sjAdd">
					<view class="add-top">
						<text>{{sjAdd.name}}</text>
						<text style="margin-left: 40rpx;">{{sjAdd.phone}}</text>
					</view>
					<view class="add-bottom">
						{{sjAdd.province}}-{{sjAdd.city}}-{{sjAdd.district}}-{{sjAdd.detail}}
					</view>
				</view>
			</view>
		</view>
		<view class="chooseBox" @click="goodsShow=true">
			<view class="text">
				货物信息
				<view class="tips">必填</view>
			</view>
			<view class="chooseText">
				<!-- 请完善货物信息 -->
				<input type="text" v-model="goodsText" disabled placeholder="请完善货物信息" style="width:350rpx;height:100%;font-size: 28rpx;"/>
				<u-icon name="arrow-right" style="margin-left: 24rpx;"></u-icon>
			</view>
		</view>
		<view class="chooseBox" @click="$refs.chooseTime.open()">
			<view class="text">
				预约时间
			</view>
			<view class="chooseText">
				<input type="text" v-model="dayTime" disabled placeholder="请选择预约时间" style="width:400rpx;height:100%;font-size: 28rpx;"/>
				<u-icon name="arrow-right" style="margin-left: 24rpx;"></u-icon>
			</view>
		</view>
		<view class="chooseBox" @click="getenquiryOrder()">
			<view class="text">
				配送公司
			</view>
			<view class="chooseText">
				<!-- 请选择配送公司 -->
				<input type="text" v-model="deliveryInfo.delivery_business_name" disabled placeholder="请选择配送公司" style="width:400rpx;height:100%;font-size: 28rpx;"/>
				<u-icon name="arrow-right" style="margin-left: 24rpx;"></u-icon>
			</view>
		</view>
		<!-- <view class="chooseBox">
			<view class="text">
				保价金额
			</view>
			<view class="chooseText">
				<input type="text" v-model="form.insured_amount" placeholder="请输入物品价值，高于1元" style="height:100%;font-size: 28rpx;"/>
			</view>
		</view> -->
		<view class="chooseBox">
			<view class="text">
				备注
			</view>
			<view class="chooseText">
				<input type="text" v-model="form.remark" placeholder="请填写" style="height:100%;font-size: 28rpx;"/>
			</view>
		</view>
		<view class="take">
			<view class="title">
				<image src="../../static/image/tips.png" class="icon" mode=""></image>
				注意事项
			</view>
			<view class="text">
				<view>1、请主动联系快递员，确定取件时间，如遇到快递员不愿取件，可取消订单并重新选择其他快递公司</view>
				<view>2、快递包装耗材单独计费请尽量自行包装好。如使用了快递员提供的包装耗材，需回平台补缴耗材费</view>
				<view>3、百世寄件，县、乡镇、涉及乡镇服务费，货物为二手物品，保丢不保赔，请妥善选择</view>
			</view>
		</view>
		
		<view class="bottom">
			<view class="left">
				<view class="bo-left-top" @click="mxShow=true">
					<view class="top-left">预估 <text style="color:#D30401;margin-left: 20rpx;">￥{{deliveryInfo.pre_order_fee||'0.00'}}</text></view>
					<view class="top-right"><text style="color:#AAAAAA;margin-right: 20rpx;">|</text> 明细 <u-icon name="arrow-up" style="margin-left: 20rpx;"></u-icon></view>
				</view>
				<view class="bo-left-bottom">
					<view class="check">
						<checkbox-group @change="checkboxChange">
							<label>
								<checkbox value="cb" color="#1AA261"/>
								我已阅读并确认同意<text style="color:#208DE2" @click="goInfo('/pages-send/protocol/protocol')">《寄件服务协议》</text>
							</label>
						</checkbox-group>
					</view>
				</view>
			</view>
			<view class="right" @click="placeOrder">下单</view>
		</view>
		
		
		<!-- 货物信息 -->
		<u-popup v-model="goodsShow" mode="bottom" border-radius="20" closeable>
			<view class="goodsInfo">
				<view class="title">货物信息</view>
				<view class="goodsBox">
					<view class="goodName">
						<view class="top">
							<view class="title-sub">
								物品名称 <view class="tips">必填</view>
							</view>
							<view class="wj" @click="wjShow=true;getSettingInfo()">
								<image src="../../static/image/wj.png" class="wjIcon" mode=""></image>
								查看禁寄物品
							</view>
						</view>
						<view class="goodsChoose">
							<u-radio-group v-model="form.goods_name" @change="radioGroupChange">
								<u-radio 
									@change="radioChange" 
									v-for="(item, index) in list" :key="index" 
									:name="item.name"
									:disabled="item.disabled"
									active-color="#fff"
								>
									{{item.name}}
								</u-radio>
							</u-radio-group>
						</view>
					</view>
					<view class="inps">
						<view class="left">包裹数量 <view class="tips">必填</view></view>
						<view class="right"><input type="text" class="inp" v-model="form.package_count"/>个</view>
					</view>
					<view class="inps">
						<view class="left">物品预估重量 <view class="tips">必填</view></view>
						<view class="right"><input type="text" class="inp" v-model="form.weight"/>kg</view>
					</view>
					<view class="inpss">
						<view class="left">长 X 宽 X 高 </view>
						<view class="right"><input type="text" class="inp" placeholder="长" v-model="form.volume_long"/>-<input type="text" class="inp" placeholder="宽" v-model="form.volume_width"/>-<input type="text" class="inp" placeholder="高" v-model="form.volume_height"/>cm</view>
					</view>
					<view class="inps">
						<view class="left">体积(输入长宽高自动计算)</view>
						<view class="right">
							<!-- <input type="text" class="inp" v-model="form.volume"/> -->
							<text v-if="form.volume_long&&form.volume_width&&form.volume_height">{{form.volume_long*form.volume_width*form.volume_height}}</text>
							<text v-else>0</text>
							cm³
						</view>
					</view>
					<view class="inps">
						<view class="left">保价金额</view>
						<view class="right"><input type="text" class="inp" v-model="form.insured_amount"/></view>
					</view>
					<view style="font-weight: 400;font-size: 22rpx;color: #D71D1A;">注意：下单体积不得超过XXm³</view>
					<view class="btn" @click="goodsEnter">确定</view>
				</view>
				
			</view>
		</u-popup>
		<!-- 违禁物品 -->
		<u-popup v-model="wjShow" mode="bottom" border-radius="20" closeable>
			<view class="goodsInfo">
				<view class="title">禁寄物品</view>
				<view class="goodsBox">
					<u-parse :html="content"></u-parse>
				</view>
			</view>
		</u-popup>
		
		<!-- 预约时间 -->
		<!-- <zl-delivery-time @change="changeTime" ref="chooseTime" title="请选择预约时间"></zl-delivery-time> -->
		<liu-delivery-time @change="changeTime" ref="chooseTime" title="请选择预约时间"></liu-delivery-time>
		<!-- <u-picker v-model="timeShow" :params="params" mode="time" start-year="2024" title="选择预约时间"></u-picker> -->
		
		<!-- 配送公司 -->
		<u-popup v-model="psShow" mode="bottom" border-radius="20" closeable>
			<view class="goodsInfo">
				<view class="title">配送公司</view>
				<view class="deliveryBox">
					<scroll-view scroll-y="true" style="height: 600rpx;">
						<view class="deliveryItem" v-for="(item,index) in deliveryList" @click="choosePS(index,item)">
							<view class="left">
								<image :src="item.icon" class="icon" mode=""></image>
								<view class="left-box">
									<view class="name">{{item.delivery_business_name}}</view>
									<view class="tips">{{item.channel_name}}</view>
								</view>
								
							</view>
							<view class="right">
								<view class="r-left">
									<view class="r-left-top">
										<text style="color: #CCCCCC;font-size: 20rpx;text-decoration-line: line-through;">{{item.original_fee}}元</text>
										<text style="color: #1AA261;margin-left: 6rpx;">{{item.pre_order_fee}}</text>元
									</view>
									<!-- <view class="r-left-bottom">续重<text style="color:#D30401;">￥1.3</text>/kg</view> -->
								</view>
								<view class="r-right" :style="deliveryItem==index?'color:#fff;background:#1AA261;':''">
									<u-icon name="checkbox-mark" size="24" v-if="deliveryItem==index"></u-icon>
								</view>
							</view>
						</view>
					</scroll-view>
					
				</view>
			</view>
		</u-popup>
		
		<!-- 寄件明细 -->
		<u-popup v-model="mxShow" mode="bottom" border-radius="20" closeable>
			<view class="goodsMS">
				<view class="title">预估费用明细</view>
				<view class="msBox">
					<view class="msInfo">
						<view class="context">
							<view class="key">基础运费</view>
							<view class="value">￥{{deliveryInfo.pre_order_fee||'0.00'}}</view>
						</view>
						<view class="context-z">
							<view class="key">计费重量</view>
							<view class="value">{{deliveryInfo.calc_fee_weight||0}}kg</view>
						</view>
						<!-- <view class="context-z">
							<view class="key">计费规则</view>
							<view class="value">1-50公斤，首重￥6.35，续重￥1.7</view>
						</view> -->
						<view class="context">
							<view class="key">保价费</view>
							<view class="value">￥{{deliveryInfo.pre_bj_fee||'0.00'}}</view>
						</view>
					</view>
					<view class="bottoms">
						<view class="left">
							<view class="bo-left-top" @click="mxShow=false">
								<view class="top-left">预估 <text style="color:#D30401;margin-left: 20rpx;">￥{{deliveryInfo.pre_order_fee||'0.00'}}</text></view>
								<view class="top-right"><text style="color:#AAAAAA;margin-right: 20rpx;">|</text> 明细 <u-icon name="arrow-down" style="margin-left: 20rpx;"></u-icon></view>
							</view>
							<view class="bo-left-bottom">
								<view class="check">
									<checkbox-group @change="checkboxChange">
										<label>
											<checkbox value="cb" color="#1AA261"/>
											我已阅读并确认同意<text style="color:#208DE2" @click="goInfo('/pages-send/protocol/protocol')">《寄件服务协议》</text>
										</label>
									</checkbox-group>
								</view>
							</view>
						</view>
						<view class="right">下单</view>
					</view>
				</view>
			</view>
		</u-popup>
		
		<payPopup v-if="payShow" :totalPrice="total_price" :orderNo="orderNo" @empty="empty"></payPopup>
	</view>
</template>

<script>
	import {enquiryOrder,orderAdd,getSettingInfo} from '../../common/api.js'
	import payPopup from '../../components/pay/pay.vue'
	export default {
		components:{payPopup},
		data() {
			return {
				payShow:false,
				total_price:'',
				content:'',
				
				goodsShow:false,
				wjShow:false,
				timeShow:false,
				psShow:false,
				mxShow:false,
				params: {
					year: true,
					month: true,
					day: true,
					hour: true,
					minute: true,
					second: true
				},
				
				list: [
					{
						name: '日用百货',
						disabled: false
					},
					{
						name: '电子产品',
						disabled: false
					},
					{
						name: '易碎品',
						disabled: false
					},{
						name: '贵重饰品',
						disabled: false
					},
					{
						name: '食品药品',
						disabled: false
					},
					{
						name: '其他',
						disabled: false
					}
				],
				read:false,
				
				deliveryList:[
					// {
					// 	icon:'../../static/image/st.png',
					// 	name:'申通快递',
					// 	tips:'取单慢 急件勿下'
					// },{
					// 	icon:'../../static/image/jt.png',
					// 	name:'极兔速递',
					// 	tips:'取单慢 急件勿下'
					// },{
					// 	icon:'../../static/image/jd.png',
					// 	name:'京东快递',
					// 	tips:'取单快 服务优'
					// },{
					// 	icon:'../../static/image/db.png',
					// 	name:'德邦快递',
					// 	tips:'官方直营 服务优'
					// },{
					// 	icon:'../../static/image/sf.png',
					// 	name:'顺丰快递',
					// 	tips:'取单慢 急件勿下'
					// },{
					// 	icon:'../../static/image/zt.png',
					// 	name:'中通快递',
					// 	tips:'取单慢 急件勿下'
					// },{
					// 	icon:'../../static/image/yd.png',
					// 	name:'韵达快递',
					// 	tips:'取单慢 急件勿下'
					// },
				],
				deliveryItem:'',
				jjAdd:null,
				sjAdd:null,
				
				dayTime:'',//预约时间
				goodsText:'',//货物信息
				deliveryInfo:'',//配送公司信息
				orderNo:'',
				form:{
					// order_no:'',
					delivery_type:'',
					delivery_business:'',
					channel_id:'',
					sender_name:'',
					sender_phone:'',
					sender_province:'',
					sender_city:'',
					sender_district:'',
					sender_detail:'',
					receiver_name:'',
					receiver_phone:'',
					receiver_province:'',
					receiver_city:'',
					receiver_district:'',
					receiver_detail:'',
					goods_name:'',
					package_count:'',
					weight:'',
					volume_long:'',
					volume_width:'',
					volume_height:'',
					volume:'',
					insured_amount:'',
					pickup_start_time:'',
					pickup_end_time:'',
					remark:''
				}
				
			}
		},
		onLoad() {
			uni.$on('jaddress', (data) => {
				console.log('寄件地址',data)
				this.jjAdd = data.data
				this.form.sender_name=this.jjAdd.name
				this.form.sender_phone=this.jjAdd.phone
				this.form.sender_province=this.jjAdd.province
				this.form.sender_city=this.jjAdd.city
				this.form.sender_district=this.jjAdd.district
				this.form.sender_detail=this.jjAdd.detail
				
			})
			uni.$on('saddress', (data) => {
				console.log('收件地址',data)
				this.sjAdd = data.data
				this.form.receiver_name=this.sjAdd.name
				this.form.receiver_phone=this.sjAdd.phone
				this.form.receiver_province=this.sjAdd.province
				this.form.receiver_city=this.sjAdd.city
				this.form.receiver_district=this.sjAdd.district
				this.form.receiver_detail=this.sjAdd.detail
			})
		},
		methods: {
			getSettingInfo(){
				getSettingInfo('contraband',{}).then(res=>{
					console.log(res)
					if(res.code==10000){
						this.content=res.data.contraband
					}
				})
			},
			placeOrder(){
				if(!this.jjAdd){
					uni.showToast({
						title: '请选择寄件地址',
						duration: 2000,
						icon:"none"
					});
					return
				}
				if(!this.sjAdd){
					uni.showToast({
						title: '请选择收件地址',
						duration: 2000,
						icon:"none"
					});
					return
				}
				
				if(!this.goodsText){
					uni.showToast({
						title: '请选择货物信息',
						duration: 2000,
						icon:"none"
					});
					return
				}
				// if(!this.dayTime){
				// 	uni.showToast({
				// 		title: '请选择预约时间',
				// 		duration: 2000,
				// 		icon:"none"
				// 	});
				// 	return
				// }
				if(!this.deliveryInfo){
					uni.showToast({
						title: '请选择配送公司',
						duration: 2000,
						icon:"none"
					});
					return
				}
				if(!this.read){
					uni.showToast({
						title: '请阅读和同意《寄件服务协议》',
						duration: 2000,
						icon:"none"
					});
					return
				}
				console.log(this.form)
				// return
				this.form.volume=this.form.volume_long*this.form.volume_width*this.form.volume_height
				orderAdd(this.form).then(res=>{
					console.log(res)
					if(res.code==10000){
						// uni.showToast({
						// 	title: '下单成功',
						// 	duration: 2000,
						// 	icon:"none"
						// });
						// setTimeout(()=>{
						// 	uni.navigateBack({
						// 		delta: 1
						// 	});
							
						// },500)
						this.orderNo = res.data.id
						this.total_price = res.data.total_price
						this.payShow=true
						
					}
				})
				
			},
			getenquiryOrder(){
				enquiryOrder({
					sender_name:this.form.sender_name,
					sender_phone:this.form.sender_phone,
					sender_province:this.form.sender_province,
					sender_city:this.form.sender_city,
					sender_district:this.form.sender_district,
					sender_detail:this.form.sender_detail,
					receiver_name:this.form.receiver_name,
					receiver_phone:this.form.receiver_phone,
					receiver_province:this.form.receiver_province,
					receiver_city:this.form.receiver_city,
					receiver_district:this.form.receiver_district,
					receiver_detail:this.form.receiver_detail,
					goods_name:this.form.goods_name,
					package_count:this.form.package_count,
					weight:this.form.weight,
					volume_long:this.form.volume_long,
					volume_width:this.form.volume_width,
					volume_height:this.form.volume_height,
					volume:this.form.volume_long*this.form.volume_width*this.form.volume_height,
					insured_amount:this.form.insured_amount,
					pickup_start_time:this.form.pickup_start_time,
					pickup_end_time:this.form.pickup_end_time
				}).then(res=>{
					console.log(res)
					
					if(res.code==10000){
						
						// this.orderNo = res.data.order_no
						// this.deliveryList = JSON.parse(uni.getStorageSync("kdList")).data.enquiries
						console.log(this.deliveryList)
						res.data.enquiries.forEach((item,index)=>{
							if(item.delivery_type=='SF'){
								item.icon='../../static/image/sf.png'
							}else if(item.delivery_type=='DOP'){
								item.icon='../../static/image/db.png'
							}else if(item.delivery_type=='YTO'){
								item.icon='../../static/image/yt.png'
							}else if(item.delivery_type=='JD'){
								item.icon='../../static/image/jd.png'
							}else if(item.delivery_type=='JT'){
								item.icon='../../static/image/jt.png'
							}else if(item.delivery_type=='STO-INT'){
								item.icon='../../static/image/st.png'
							}else if(item.delivery_type=='YUND'){
								item.icon='../../static/image/yd.png'
							}else if(item.delivery_type=='CAINIAO'){
								item.icon='../../static/image/cn.png'
							}else if(item.delivery_type=='ZTO'){
								item.icon='../../static/image/zt.png'
							}else if(item.delivery_type=='EMS'){
								item.icon='../../static/image/ems.png'
							}
						})
						this.deliveryList = res.data.enquiries
						this.psShow=true
						
					}
				})
			},
			// 货物确认
			goodsEnter(){
				console.log(this.form.goods_name+'*'+this.form.package_count+'-'+this.form.weight+'kg')
				if(!this.form.goods_name){
					uni.showToast({
						title: '请选择物品名称',
						duration: 2000,
						icon:"none"
					});
					return
				}
				if(!this.form.package_count){
					uni.showToast({
						title: '请输入包裹数量',
						duration: 2000,
						icon:"none"
					});
					return
				}
				if(!this.form.weight){
					uni.showToast({
						title: '请输入物品重量',
						duration: 2000,
						icon:"none"
					});
					return
				}
				this.goodsText = this.form.goods_name+'*'+this.form.package_count+'-'+this.form.weight+'kg'
				this.goodsShow=false
				if(this.deliveryInfo.delivery_business_name){
					this.getenquiryOrder()
				}
			},
			// 选择公司
			choosePS(index,item){
				this.deliveryItem=index
				this.deliveryInfo = item
				this.form.delivery_type=item.delivery_type
				this.form.delivery_business=item.delivery_business
				this.form.channel_id=item.channel_id
				this.psShow = false
				
			},
			goInfo(url){
				uni.navigateTo({
					url:url
				})
			},
			//选择的时间
			changeTime(e) {
				console.log(e)
			    this.dayTime = e.value
				// this.form.pickup_start_time=new Date(e.day+' '+e.startHour).getTime()/1000
				// this.form.pickup_end_time=new Date(e.day+' '+e.endHour).getTime()/1000
				this.form.pickup_start_time=e.day+' '+e.startHour
				this.form.pickup_end_time=e.day+' '+e.endHour
				console.log(this.form.pickup_start_time,this.form.pickup_end_time)
				if(this.deliveryInfo.delivery_business_name){
					this.getenquiryOrder()
				}
			},
			// 选中某个单选框时，由radio时触发
			radioChange(e) {
				// console.log(e);
			},
			// 选中任一radio时，由radio-group触发
			radioGroupChange(e) {
				// console.log(e);
			},
			checkboxChange(e){
				console.log(e)
				if(e.detail.value.length!=0){
					this.read=true
				}else{
					this.read=false
				}
			},
			empty(){
				this.payShow=false
				this.orderNo = ''
				this.total_price = ''
				setTimeout(()=>{
					uni.navigateBack({
						delta: 1
					});
					
				},500)
			}
			
		}
	}
</script>
<style>
	page{
		background: #EDEFF2;
	}
</style>
<style lang="scss" scoped>
.content{
	width: 750rpx;
	padding: 32rpx;
	box-sizing: border-box;
	.addressBox{
		width: 100%;
		height: 333rpx;
		background: #FFFFFF;
		border-radius: 20rpx;
		padding: 56rpx 40rpx;
		display: flex;
		flex-wrap: nowrap;
		align-items: center;
		.left{
			width: 40rpx;
			display: flex;
			justify-content: center;
			flex-wrap: wrap;
			.ji{
				width: 40rpx;
				height: 40rpx;
				background: #1AA261;
				font-family: PingFangSC, PingFang SC;
				font-weight: 400;
				font-size: 20rpx;
				color: #FFFFFF;
				line-height: 20rpx;
				text-align: center;
				font-style: normal;
				line-height: 40rpx;
				border-radius: 50%;
			}
			.line{
				// width: 2rpx;
				margin: 16rpx 0;
				height: 78rpx;
				border-right: 4rpx dotted;
				border-image: linear-gradient(180deg, rgba(26, 162, 97, 1), rgba(35, 144, 227, 1)) 2 2;
				
			}
			.shou{
				width: 40rpx;
				height: 40rpx;
				background: #2390E3;
				font-family: PingFangSC, PingFang SC;
				font-weight: 400;
				font-size: 20rpx;
				color: #FFFFFF;
				line-height: 20rpx;
				text-align: center;
				font-style: normal;
				line-height: 40rpx;
				border-radius: 50%;
			}
		}
		.right{
			width: calc(100% - 32rpx - 40rpx);
			margin-left: 32rpx;
			.lines{
				width: 100%;
				border-bottom: 1rpx solid #D8D8D8;
				margin: 40rpx 0;
			}
			.address{
				.add-top{
					font-family: DINAlternate, DINAlternate;
					font-weight: bold;
					font-size: 32rpx;
					color: #333333;
					line-height: 32rpx;
					text-align: left;
					font-style: normal;
				}
				.add-bottom{
					font-family: PingFangSC, PingFang SC;
					font-weight: 400;
					font-size: 28rpx;
					color: #999999;
					line-height: 28rpx;
					text-align: left;
					font-style: normal;
					margin-top: 15rpx;
				}
			}
			.top{
				
				display: flex;
				justify-content: space-between;
				align-items: center;
				.top-left{
					.title{
						font-family: PingFangSC, PingFang SC;
						font-weight: 600;
						font-size: 32rpx;
						color: #333333;
						line-height: 32rpx;
						text-align: left;
						font-style: normal;
					}
					.text{
						font-family: PingFangSC, PingFang SC;
						font-weight: 400;
						font-size: 24rpx;
						color: #999999;
						line-height: 24rpx;
						text-align: left;
						font-style: normal;
						margin-top: 14rpx;
					}
				}
				.top-right{
					font-family: PingFangSC, PingFang SC;
					font-weight: 400;
					font-size: 28rpx;
					color: #999999;
					line-height: 28rpx;
					text-align: right;
					font-style: normal;
					display: flex;
					flex-wrap: nowrap;
					.pu{
						margin-left: 30rpx;
						color: #333333;
					}
				}
			}
		}
		
	}
	.chooseBox{
		width: 100%;
		height: 88rpx;
		background: #FFFFFF;
		border-radius: 20rpx;
		padding:0 40rpx;
		box-sizing: border-box;
		margin-top: 24rpx;
		display: flex;
		justify-content: space-between;
		align-items: center;
		.text{
			font-family: PingFangSC, PingFang SC;
			font-weight: 400;
			font-size: 28rpx;
			color: #666666;
			line-height: 28rpx;
			text-align: left;
			font-style: normal;
			display: flex;
			flex-wrap: nowrap;
			align-items: center;
			.tips{
				width: 56rpx;
				height: 24rpx;
				background: #FFFFFF;
				border-radius: 12rpx;
				border: 1rpx solid #D30401;
				font-family: PingFangSC, PingFang SC;
				font-weight: 400;
				font-size: 16rpx;
				color: #D30401;
				text-align: center;
				font-style: normal;
				line-height: 24rpx;
				margin-left: 16rpx;
			}
		}
		.chooseText{
			font-family: PingFangSC, PingFang SC;
			font-weight: 400;
			font-size: 28rpx;
			color: #333333;
			line-height: 28rpx;
			text-align: right;
			font-style: normal;
			display: flex;
			flex-wrap: nowrap;
			align-items: center;
			
		}
	}
	.take{
		margin-top: 56rpx;
		margin-bottom: 200rpx;
		.title{
			.icon{
				width: 30rpx;
				height: 28rpx;
				margin-right: 12rpx;
			}
			font-family: PingFangSC, PingFang SC;
			font-weight: 600;
			font-size: 28rpx;
			color: #333333;
			line-height: 28rpx;
			font-style: normal;
			display: flex;
			flex-wrap: nowrap;
			align-items: center;
		}
		.text{
			margin-top: 32rpx;
			font-family: PingFangSC, PingFang SC;
			font-weight: 400;
			font-size: 22rpx;
			color: #666666;
			line-height: 34rpx;
			text-align: left;
			font-style: normal;
		}
	}
	.bottom{
		width: 100%;
		height: 190rpx;
		background: #FFFFFF;
		position: fixed;
		bottom: 0;
		left: 0;
		padding: 24rpx 32rpx;
		box-sizing: border-box;
		display: flex;
		justify-content: space-between;
		align-items: center;
		.right{
			width: 256rpx;
			height: 88rpx;
			background: #1AA261;
			border-radius: 44rpx;
			font-family: PingFangSC, PingFang SC;
			font-weight: 400;
			font-size: 30rpx;
			color: #FFFFFF;
			line-height: 88rpx;
			text-align: center;
			font-style: normal;
			
		}
		.left{
			.bo-left-top{
				display: flex;
				flex-wrap: nowrap;
				align-items: center;
				.top-left{
					font-family: PingFangSC, PingFang SC;
					font-weight: 400;
					font-size: 28rpx;
					color: #666666;
					line-height: 28rpx;
					font-style: normal;
				}
				.top-right{
					margin-left: 20rpx;
					font-family: PingFangSC, PingFang SC;
					font-weight: 400;
					font-size: 28rpx;
					color: #231916;
					line-height: 28rpx;
					font-style: normal;
				}
			}
			.bo-left-bottom{
				margin-top: 16rpx;
				.check{
					font-size: 18rpx;
					// text-align: center;
					// display: flex;
					// align-items: center;
					// justify-content: center;
					// margin-top: 60rpx;
				}
			}
		}
	}

	.goodsInfo{
		.title{
			width: 750rpx;
			height: 108rpx;
			background: #EDEFF2;
			border-radius: 20rpx 20rpx 0rpx 0rpx;
			font-family: PingFangSC, PingFang SC;
			font-weight: 600;
			font-size: 32rpx;
			color: #333333;
			line-height: 108rpx;
			text-align: center;
			font-style: normal;
		}
		.goodsBox{
			padding: 32rpx;
			box-sizing: border-box;
			background: #fff;
			.goodName{
				border-bottom: 1rpx solid  #EEEEEE;
				padding-bottom: 32rpx;
				.top{
					display: flex;
					justify-content: space-between;
					align-items: center;
					.title-sub{
						font-family: PingFangSC, PingFang SC;
						font-weight: 400;
						font-size: 28rpx;
						color: #333333;
						line-height: 28rpx;
						text-align: left;
						font-style: normal;
						display: flex;
						flex-wrap: nowrap;
						align-items: center;
						.tips{
							margin-left: 16rpx;
							width: 56rpx;
							height: 24rpx;
							background: #FFFFFF;
							border-radius: 12rpx;
							border: 1rpx solid #D30401;
							font-family: PingFangSC, PingFang SC;
							font-weight: 400;
							font-size: 16rpx;
							color: #D30401;
							line-height: 24rpx;
							text-align: center;
							font-style: normal;
						}
					}
					.wj{
						font-family: PingFangSC, PingFang SC;
						font-weight: 400;
						font-size: 18rpx;
						color: #D30401;
						line-height: 18rpx;
						text-align: right;
						font-style: normal;
						display: flex;
						flex-wrap: nowrap;
						align-items: center;
						.wjIcon{
							width: 18rpx;
							height: 18rpx;
							margin-right: 8rpx;
						}
					}
				}
				.goodsChoose{
					margin-top: 34rpx;
				}
			}
			.inpss{
				display: flex;
				justify-content: space-between;
				align-items: center;
				border-bottom: 1rpx solid  #EEEEEE;
				padding: 32rpx 0;
				.left{
					font-family: PingFangSC, PingFang SC;
					font-weight: 400;
					font-size: 28rpx;
					color: #333333;
					line-height: 28rpx;
					text-align: left;
					font-style: normal;
					display: flex;
					flex-wrap: nowrap;
					align-items: center;
					.tips{
						margin-left: 16rpx;
						width: 56rpx;
						height: 24rpx;
						background: #FFFFFF;
						border-radius: 12rpx;
						border: 1rpx solid #D30401;
						font-family: PingFangSC, PingFang SC;
						font-weight: 400;
						font-size: 16rpx;
						color: #D30401;
						line-height: 24rpx;
						text-align: center;
						font-style: normal;
					}
				}
				.right{
					font-family: PingFangSC, PingFang SC;
					font-weight: 400;
					font-size: 28rpx;
					color: #333333;
					line-height: 28rpx;
					text-align: center;
					font-style: normal;
					display: flex;
					flex-wrap: nowrap;
					align-items: center;
					.inp{
						width: 120rpx;
						height: 56rpx;
						border-radius: 35rpx;
						border: 1rpx solid #CCCCCC;
						margin-right: 16rpx;
					}
				}
			}
			.btn{
				width: 100%;
				height: 88rpx;
				background: #1AA261;
				border-radius: 44rpx;
				font-family: PingFangSC, PingFang SC;
				font-weight: 400;
				font-size: 30rpx;
				color: #FFFFFF;
				line-height: 88rpx;
				text-align: center;
				font-style: normal;
				margin: 50rpx 0;
			}
			.inps{
				display: flex;
				justify-content: space-between;
				align-items: center;
				border-bottom: 1rpx solid  #EEEEEE;
				padding: 32rpx 0;
				.left{
					font-family: PingFangSC, PingFang SC;
					font-weight: 400;
					font-size: 28rpx;
					color: #333333;
					line-height: 28rpx;
					text-align: left;
					font-style: normal;
					display: flex;
					flex-wrap: nowrap;
					align-items: center;
					.tips{
						margin-left: 16rpx;
						width: 56rpx;
						height: 24rpx;
						background: #FFFFFF;
						border-radius: 12rpx;
						border: 1rpx solid #D30401;
						font-family: PingFangSC, PingFang SC;
						font-weight: 400;
						font-size: 16rpx;
						color: #D30401;
						line-height: 24rpx;
						text-align: center;
						font-style: normal;
					}
				}
				.right{
					font-family: PingFangSC, PingFang SC;
					font-weight: 400;
					font-size: 28rpx;
					color: #333333;
					line-height: 28rpx;
					text-align: right;
					font-style: normal;
					display: flex;
					flex-wrap: nowrap;
					align-items: center;
					.inp{
						width: 158rpx;
						height: 56rpx;
						border-radius: 35rpx;
						border: 1rpx solid #CCCCCC;
						margin-right: 16rpx;
						text-align: center;
					}
				}
			}
		}
	}
	.deliveryBox{
		padding: 32rpx;
		box-sizing: border-box;
		background: #fff;
		.deliveryItem{
			display: flex;
			justify-content: space-between;
			align-items: center;
			border-bottom: 1rpx solid #EEEEEE;
			padding: 20rpx 0;
			.right{
				display: flex;
				flex-wrap: nowrap;
				align-items: center;
				.r-left{
					.r-left-top{
						font-family: DINAlternate, DINAlternate;
						font-weight: bold;
						font-size: 32rpx;
						color: #333333;
						line-height: 32rpx;
						text-align: right;
						font-style: normal;
					}
					.bo-left-bottom{
						font-family: PingFangSC, PingFang SC;
						font-weight: 400;
						font-size: 18rpx;
						color: #CCCCCC;
						line-height: 18rpx;
						text-align: right;
						font-style: normal;
						margin-top: 10rpx;
					}
				}
				.r-right{
					margin-left: 18rpx;
					width: 30rpx;
					height: 30rpx;
					// background: #FFFFFF;
					border: 1rpx solid #979797;
					border-radius: 50%;
					text-align: center;
					line-height: 20rpx;
					// background: #1AA261;
					// color: #fff;
				}
			}
			.left{
				display: flex;
				flex-wrap: nowrap;
				align-items: center;
				.icon{
					width: 48rpx;
					height: 48rpx;
					border-radius: 50%;
				}
				.left-box{
					margin-left: 12rpx;
					.name{
						
						font-family: PingFangSC, PingFang SC;
						font-weight: 400;
						font-size: 30rpx;
						color: #333333;
						line-height: 28rpx;
						text-align: left;
						font-style: normal;
					}
					.tips{
						font-family: PingFangSC, PingFang SC;
						font-weight: 400;
						font-size: 20rpx;
						color: #999;
						line-height: 28rpx;
						text-align: left;
						font-style: normal;
						margin-top: 12rpx;
					}
				}
				
			}
		}
	}

	.goodsMS{
		.title{
			width: 750rpx;
			height: 108rpx;
			background: #EDEFF2;
			border-radius: 20rpx 20rpx 0rpx 0rpx;
			font-family: PingFangSC, PingFang SC;
			font-weight: 600;
			font-size: 32rpx;
			color: #333333;
			line-height: 108rpx;
			text-align: center;
			font-style: normal;
		}
		.msBox{
			.msInfo{
				background: #FFFFFF;
				padding: 24rpx 32rpx;
				box-sizing: border-box;
				.context{
					display: flex;
					justify-content: space-between;
					align-items: center;
					margin-top: 32rpx;
					.key,.value{
						font-family: PingFangSC, PingFang SC;
						font-weight: 400;
						font-size: 28rpx;
						color: #333333;
						line-height: 28rpx;
						text-align: left;
						font-style: normal;
					}
				}
				.context-z{
					margin-top: 32rpx;
					display: flex;
					justify-content: space-between;
					align-items: center;
					font-family: PingFangSC, PingFang SC;
					font-weight: 400;
					font-size: 24rpx;
					color: #999999;
					line-height: 24rpx;
					text-align: left;
					font-style: normal;
				}
			}
			.bottoms{
				width: 100%;
				height: 190rpx;
				background: #FFFFFF;
				// position: fixed;
				// bottom: 0;
				// left: 0;
				padding: 24rpx 32rpx;
				box-sizing: border-box;
				display: flex;
				justify-content: space-between;
				align-items: center;
				.right{
					width: 256rpx;
					height: 88rpx;
					background: #1AA261;
					border-radius: 44rpx;
					font-family: PingFangSC, PingFang SC;
					font-weight: 400;
					font-size: 30rpx;
					color: #FFFFFF;
					line-height: 88rpx;
					text-align: center;
					font-style: normal;
					
				}
				.left{
					.bo-left-top{
						display: flex;
						flex-wrap: nowrap;
						align-items: center;
						.top-left{
							font-family: PingFangSC, PingFang SC;
							font-weight: 400;
							font-size: 28rpx;
							color: #666666;
							line-height: 28rpx;
							font-style: normal;
						}
						.top-right{
							margin-left: 20rpx;
							font-family: PingFangSC, PingFang SC;
							font-weight: 400;
							font-size: 28rpx;
							color: #231916;
							line-height: 28rpx;
							font-style: normal;
						}
					}
					.bo-left-bottom{
						margin-top: 16rpx;
						.check{
							font-size: 18rpx;
							// text-align: center;
							// display: flex;
							// align-items: center;
							// justify-content: center;
							// margin-top: 60rpx;
						}
					}
				}
			}
		}
	}
}
</style>
